<template>
  <!--  可用币种列表-->
  <el-select v-model="myValue" size="small" filterable clearable>
    <el-option
      :placeholder="placeholder || '未选择'"
      v-for="item in optionsList"
      :key="item.value"
      :label="item.label"
      @change="onChange"
      :value="item.value"
    >
    </el-option>
  </el-select>
</template>

<script>

import ApiRateBoc from "@/api/exchangeRate.rateBoc";
import ApiRateOther from '@/api/exchangeRate.rateOther'

export default {
  name: 'cascader-currency',
  props: [
    'value',
    'placeholder'
  ],
  data() {
    return {
      optionsList: [],
      myValue: null,
      currencyOptions: [],
      otherCurrencyList: [],
    };
  },
  watch: {
    value: {
      handler(val) {
        this.myValue = val;
      },
      immediate: true,
    },
  },
  computed: {

    otherCurrencyOptions() {

      var options = [];

      this.otherCurrencyList.forEach(item => options.push({
        value: item.code,
        label: `${item.code}-${item.name}`,
      }));

      return options;
    },

    options() {
      return [
        {
          value: "boc",
          label: "中行汇率",
          children: this.currencyOptions,
        },
        // {
        //   value: "other",
        //   label: "其他汇率",
        //   children: this.otherCurrencyOptions,
        // }
      ];
    },
  },

  mounted() {
    this.fetchOptions();
  },

  methods: {

    dataFilter(node, val) {
      console.log('val', val, 'node', node)
      if (!!~node.text.indexOf(val) || !!~node.text.toUpperCase().indexOf(val.toUpperCase())) {
        return true
      }
    },


    async fetchOptions() {
      this.optionsList = await ApiRateBoc.getrateBocOptions()
      console.log(this.optionsList)
      // this.currencyOptions = await ApiRateBoc.getCurrencyOptions();
      // var re = await ApiRateOther.list({
      //   page: 1, limit: 1e3,
      //   search: {
      //     status: 1,
      //   },
      // });

      // this.otherCurrencyList = re.list;
    },
    onChange(e) {
      this.$emit("input", e);
      this.$emit("change", e);
    },
  },
}
</script>

<style scoped>
</style>
